<?php /** @var User $CurrentUser */ ?>
<div id="want-to-buy-dialog" title="求购商品">
    <form id="want-to-buy-form">
        <input type="hidden" name="user_id" value="<?php echo isset($CurrentUser) ? $CurrentUser->getId() : 0; ?>"/>
        <div class="left-right-side">
            <div class="input-group left-side">
                <label for="commodity-require-title" class="input-group-addon">求购标题</label>
                <input type="text" name="commodity_require_title" id="commodity-require-title" class="form-control" maxlength="19" required="required" placeholder="请填写求购标题"/>
            </div>
            <div class="input-group right-side">
                <label for="release-type" class="input-group-addon">求购类型</label>
                <select id="release-type" name="release-type" class="form-control">
                    <option value="1" selected>求物</option>
                    <option value="3">求帮</option>
                </select>
            </div>
        </div>
        <div class="left-right-side">
            <div class="input-group left-side">
                <label for="commodity-require-min-price" class="input-group-addon">价格下限</label>
                <input type="number" name="commodity_require_min_price" id="commodity-require-min-price" class="form-control" placeholder="请填写价格下限">
            </div>
            <div class="input-group right-side">
                <label for="commodity-require-max-price" class="input-group-addon">价格上限</label>
                <input type="number" name="commodity_require_max_price" id="commodity-require-max-price" class="form-control" placeholder="请填写价格上限">
            </div>
        </div>
        <div class="left-right-side">
            <div class="input-group left-side">
                <label for="commodity-contact-info" class="input-group-addon">联系方式</label>
                <select id="commodity-contact-type" name="commodity_contact_type" class="form-control" style="float:left; width:32%;">
                    <option value="<?php echo _ContactType_LongPhone ?>"  <?php echo (($CurrentUser->getUserInfo()->getDefaultContactType())==_ContactType_LongPhone)?"selected":""; ?>>长号</option>
                    <option value="<?php echo _ContactType_ShortPhone ?>" <?php echo (($CurrentUser->getUserInfo()->getDefaultContactType())==_ContactType_ShortPhone)?"selected":""; ?>>短号</option>
                    <option value="<?php echo _ContactType_Qq ?>" <?php echo (($CurrentUser->getUserInfo()->getDefaultContactType())==_ContactType_Qq)?"selected":""; ?>>QQ</option>
                </select>
                <input type="text" id="commodity-contact-info" name="commodity_contact_info" class="form-control" style="float:left; width:68%" value="<?php echo (($CurrentUser->getUserInfo()->getDefaultContactType())==_ContactType_LongPhone)?$CurrentUser->getUserInfo()->getPhone():(((($CurrentUser->getUserInfo()->getDefaultContactType())==_ContactType_ShortPhone))?$CurrentUser->getUserInfo()->getPhoneShort():$CurrentUser->getUserInfo()->getQq());?>"/>
            </div>
            <div class="input-group right-side">
                <label for="commodity-require-num" id="commodity-require-num-span" class="input-group-addon">需求数量</label>
                <input type="number" id="commodity-require-num" name="commodity_require_num" class="form-control" min="0" max="10000" placeholder="请输入需要的数量"/>
            </div>
        </div>
        <div class="input-group-has-textarea" style="position:relative;">
            <label for="commodity-require-content" class="input-group-addon">物品描述</label>
            <textarea id="commodity-require-content" name="commodity_require_content" class="form-control commodity-require-content" rows="4" placeholder="请填写描述" style="resize:none; margin:0px;"></textarea>
            <div class="limit-words" style="top:10px;">还可以输入 <b class="limit-words-num">180</b> 字</div>
        </div>
        <div class="input-group">
            <input type="submit" class="form-control" value="发布"/>
        </div>
    </form>
</div>

<script>
    $(function () {

        $("#release-type").change(function () {
            if ($("#release-type").val() == "3") {
                $('#commodity-require-min-price').val("0");
                $('#commodity-require-min-price').attr("readonly", "readonly");
                $('#commodity-require-max-price').val("0");
                $('#commodity-require-max-price').attr("readonly", "readonly");
                $('#commodity-require-num-span').html("答谢报酬");
                $('#commodity-require-num').attr('placeholder',"请写入答谢的方式");
            } else {
                $('#commodity-require-min-price').removeAttr("readonly");
                $('#commodity-require-min-price').val("");
                $('#commodity-require-max-price').removeAttr("readonly");
                $('#commodity-require-max-price').val("");
                $('#commodity-require-num-span').html("需求数量");
            }
        });

        var $commodityCategory = $('#commodity-category');
        $commodityCategory.val($commodityCategory.children().first().val());
        var $subCatSelect = $('#commodity-sub-category');

        function showSubCatByFatherId(fatherId) {
            var $nowToShowSubCat = $('option[data-father-id=' + fatherId + ']');
            $subCatSelect.children().hide();
            $nowToShowSubCat.show();
            $subCatSelect.val($nowToShowSubCat.first().val());
        }

        showSubCatByFatherId($commodityCategory.children().first().val());

        $commodityCategory.change(function () {
            var nowMasterCatId = $(this).val();
            $subCatSelect.children().hide();
            var $nowToShowSubCat = $('option[data-father-id=' + nowMasterCatId + ']');
            if ($nowToShowSubCat.length) {
                $nowToShowSubCat.show();
                $subCatSelect.show();
                $commodityCategory.css('width', '32%');
            } else {
                $subCatSelect.hide();
                $commodityCategory.css('width', '100%');
            }
            $subCatSelect.val($nowToShowSubCat.first().val());
        });
        $("#want-to-buy-form").validate({
            submitHandler: function (form) {
                $.ajax({
                    url: '<?php echo base_url('api/wantToBuy');?>',
                    type: 'post',
                    data: $(form).serialize(),
                    success: function (jsonrsp) {
                        try {
                            var rsp = $.parseJSON(jsonrsp);
                            noty({type: rsp.type, text: rsp.message, callback: {
                                afterClose: function () {
                                    switch (rsp.type) {
                                        case 'success':
                                            location.reload();
                                            break;
                                        default:
                                            break;
                                    }
                                }
                            }});
                        } catch (ex) {
                            noty({type: 'error', text: '发生内部错误，请联系管理员'});
                            throw ex;
                        }
                    }
                });
            }
        });


        $('#commodity-contact-type').change(function(){
                switch ($(this).val()){
                    case '<?php echo _ContactType_LongPhone?>':
                        $('#commodity-contact-info').val('<?php echo $CurrentUser->getUserInfo()->getPhone()?>');
                        break;
                    case '<?php echo _ContactType_ShortPhone?>':
                        $('#commodity-contact-info').val('<?php echo $CurrentUser->getUserInfo()->getPhoneShort()?>');
                        break;
                    case '<?php echo _ContactType_Qq?>':
                        $('#commodity-contact-info').val('<?php echo $CurrentUser->getUserInfo()->getQq()?>');
                        break;
                }
            }
        );
    });
</script>
<!--限制字数-->
<script type="text/javascript">
   var txtobj = {
        divName     : "input-group-has-textarea", //外层容器的class
        textareaName: "commodity-require-content", //textarea的class
        numName     : "limit-words-num", //数字的class
        num         : 180 //数字的最大数目
    }
    var textareaFn = function () {
        //定义变量
        var $onthis;//指向当前
        var $divname = txtobj.divName; //外层容器的class
        var $textareaName = txtobj.textareaName; //textarea的class
        var $numName = txtobj.numName; //数字的class
        var $num = txtobj.num; //数字的最大数目
        function isChinese(str) {  //判断是不是中文
            var reCh = /[u00-uff]/;
            return !reCh.test(str);
        }

        function numChange() {
            var strlen = 0; //初始定义长度为0
            var txtval = $.trim($onthis.val());
            for (var i = 0; i < txtval.length; i++) {
                if (isChinese(txtval.charAt(i)) == true) {
                    strlen = strlen + 2;//中文为2个字符
                } else {
                    strlen = strlen + 1;//英文一个字符
                }
            }
            strlen = Math.ceil(strlen / 2);//中英文相加除2取整数
            if ($num - strlen < 0) {
                $par.html("超出 <b style='color:red;font-weight:lighter' id='chaochu' class=" + $numName + ">" + Math.abs($num - strlen) + "</b> 字"); //超出的样式
            }
            else {
                $par.html("还可以输入 <b class=" + $numName + ">" + ($num - strlen) + "</b> 字"); //正常时候
            }
            $b.html($num - strlen);
        }

        $("." + $textareaName).on("focus", function () {
            $b = $(this).parents("." + $divname).find("." + $numName); //获取当前的数字
            $par = $b.parent();
            $onthis = $(this); //获取当前的textarea
            var setNum = setInterval(numChange, 500);
        });
    }
    textareaFn();
</script>